.o-card {
  --card-bg-color: var(--o-color-fill2);
  --card-radius: var(--o-radius_control-l);

  --card-shadow: none;
  --card-shadow-hover: var(--o-shadow-2);
  --card-shadow-active: var(--o-shadow-1);

  --card-cover-radius: var(--o-radius_control-s);

  --card-h-cover-width: 45%;
  --card-h-cover-max-width: 320px;

  --card-main-padding: 24px 32px;

  --card-icon-gap: 16px;
  --card-icon-color: var(--o-color-info1);
  --card-icon-size: var(--o-icon_size_control-xl);

  --card-header-color: var(--o-color-info1);
  --card-header-text-size: var(--o-font_size-h3);
  --card-header-text-height: var(--o-line_height-h3);

  --card-title-word-break: break-all;

  --card-content-gap: 12px;
  --card-content-color: var(--o-color-info2);
  --card-content-text-size: var(--o-font_size-text1);
  --card-content-text-height: var(--o-line_height-text1);

  --card-detail-word-break: break-all;

  --card-footer-gap: 24px;
  --card-footer-color: var(--o-color-info2);
  --card-footer-text-size: var(--o-font_size-tip1);
  --card-footer-text-height: var(--o-line_height-tip1);
}

.o-card-cover-v {
  --card-cover-padding: 8px 8px 0;
}

.o-card-cover-h {
  --card-cover-padding: 8px 0 8px 8px;
}

.o-card-cover-hr {
  --card-cover-padding: 8px 8px 8px 0;
}

.o-card-only-cover {
  --card-cover-padding: 0;
}
